import store from '@/store'
import axios from 'axios'
import { ElMessage } from 'element-plus'
import config from '../config'



//创建axios实例
const API = axios.create({
    baseURL: config.BASE_URL,  //请求后端数据的基本地址，自定义
    timeout: 10000   //请求超时设置，单位ms
})

//添加请求拦截器，若token存在则在请求头中加 token ，不存在也继续请求
API.interceptors.request.use(
    config => {
        console.log("request",config)
        store.dispatch("setLoading",true)
        const token = localStorage.getItem('token');
        if(token!= null){
//每次发送请求前简则vuex是否存有 token ，放在请求头发送给服务器
        //Authorization 是根据后端自定义字段
        config.headers.Authorization = token
        }
        return config;
    },
    error => {
        console.log('在request拦截器显示错误:',error.response);
        return Promise.reject(error);
    }
)

//response 拦截器
API.interceptors.response.use(
    response => {
        console.log("response",response)
        store.dispatch("setLoading",false)
        //在 status 正确的情况下，code 不正确则返回对应的错误信息(后台自定义200是正确，并且将错误信息写在message中),正确则返回响应
        return response.status !== 200 ? Promise.reject(response):response ;
    },
    error => {
        console.log("error",error)
        if(error.code==="ERR_NETWORK"){
            return ElMessage.error("网络连接异常");
        }
        if(error.response.status===400 && error.response.data.code == 401){
            //可能是 token 过期，清除它
            store.dispatch('delToken');
            return ElMessage.error("token过期，请重新登入");
        }
        return ElMessage.error(error.response.data.message);
    }

)

export default API